<template>
    <div class="grid gap-[20px] unity-right">
        <!-- 告警事件 -->
        <alarmevents :title="title" :data="alarmList" :type="1" :isshowlefts="isshowlefts"  class="item1-1"/>
        <!-- 工单处理 -->
        <alarmevents :title="title2" :data="workOrder" :type="2" :isshowlefts="isshowlefts2" class="item1-2" />
        <!-- 日常巡检 -->
        <alarmevents :title="title3" :data="inspection" :type="3" :isshowlefts="isshowlefts3" class="item1-3"/>
    </div>
</template>
<script setup lang="ts">
import { getScreealarm, screenworkorder, screeninspect } from '@/api/screen/largeData'
import alarmevents from '@/views/large-data-screen/component/public/alarmevents.vue';
import img1 from '@/assets/screenimg/samllIcon.png'
import img2 from '@/assets/screenimg/samllIcon1.png'
import img3 from '@/assets/screenimg/samllIcon3.png'
import img4 from '@/assets/screenimg/samllIcon4.png'
import { showAlarmList, showLnspectionTasks, showWorkOrder } from '@/views/large-data-screen/utils/index'
import { timeFormat } from '@/utils/functions'
import { emitter } from '@/utils/mitt'
const selectTime = ref(0) //选择时间
const selectTime2 = ref(0) //选择时间
const selectTime3 = ref(0) //选择时间
const isshowlefts = ref(true) //动画效果
const isshowlefts2 = ref(true) //动画效果
const isshowlefts3 = ref(true) //动画效果
const title = ref('告警事件')
const title2 = ref('工单处理')
const title3 = ref('日常巡检')
// 时间选择
const timeList = ref([
    {
        name: '日',
        id: 1
    },
    {
        name: '周',
        id: 2

    },
    {
        name: '月',
        id: 3

    },
    {
        name: '年',
        id: 4

    }
])
const timeMap = {
    /** 本日 */
    today: timeFormat(new Date(), 'd'),
    /** 本周一 */
    monday: timeFormat(new Date(new Date().setDate(new Date().getDate() - new Date().getDay() + 1)), "d"),
    /** 本周日 */
    sunday: timeFormat(new Date(new Date().setDate(new Date().getDate() + (7 - new Date().getDay()))), "d"),
    /** 本月第一天 */
    firstDayOfMonth: timeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), "d"),
    /** 本月最后一天 */
    lastDayOfMonth: timeFormat(new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0), "d"),
    /** 本年第一天 */
    firstDayOfYear: timeFormat(new Date(new Date().getFullYear(), 0, 1), "d"),
    /** 本年最后一天 */
    lastDayOfYear: timeFormat(new Date(new Date().getFullYear(), 11, 31), "d")
}
//告警事件
const alarmList = ref([
    {
        name: '已处理(起)',
        color: '#21CC31',
        number: 0,
        type: 1,
        img: img2,
        clickFun: () => showAlarmList(
            {
                defaultSearch: {
                    searchType: 1,
                    dealStatus: 3,
                    createdAt: [clickTime.value, clickTimes.value],
                    startTime: clickTime.value,
                    endTime: clickTimes.value,
                }
            })
    },
    {
        name: '待确认(起)',
        number: 0,
        color: '#27E6E1',
        type: 2,
        img: img1,
        clickFun: () => showAlarmList({ defaultSearch: { searchType: 1, confirm: -1, } })
    },
    {
        name: '待处理(起)',
        number: 0,
        color: '#FF802B',
        type: 3,
        img: img3,
        clickFun: () => showAlarmList({ defaultSearch: { searchType: 1, dealStatus: -1, } })
    },

])
//工单
const workOrder = ref([
    {
        name: '已处理(起)',
        color: '#21CC31',
        number: 0,
        type: 1,
        img: img2,
        clickFun: () => showWorkOrder({ defaultSearch: { workOrderStatus: 4 } })
    },

    {
        name: '待处理(起)',
        number: 0,
        color: '#FF802B',
        type: 3,
        img: img3,
        clickFun: () => showWorkOrder({ defaultSearch: { workOrderStatus: 1 } })
    },

])
//日常巡检
const inspection = ref([
    {
        name: '任务数量',
        color: '#21CC31',
        number: 0,
        type: 4,
        img: img4,
        clickFun: () => showLnspectionTasks({ defaultSearch: {} })
    },
    {
        name: '已检点位',
        number: 0,
        color: '#27E6E1',
        type: 1,
        img: img2,
        clickFun: () => showLnspectionTasks({ defaultSearch: { missionStatus: 3, } })
    },
    {
        name: '待检点位',
        number: 0,
        color: '#FF802B',
        type: 3,
        img: img3,
        clickFun: () => showLnspectionTasks({ defaultSearch: { missionStatus: 1 } })
    },

])

const alarmEventDT = ref(0)
const workOrderDT = ref(1)
const workOrderTypeDT = ref(0)
const inspectDT = ref(1)
//点击年月日
const clickTime = ref()
const clickTimes = ref()
const clickTime2 = ref()
const clickTimes2 = ref()
const clickTime3 = ref()
const clickTimes3 = ref()
const changeList = (item, type, index) => {

    if (type == 1) {  // 告警事件
        // console.log("告警事件", type);

        alarmEventDT.value = item.id
        selectTime.value = index
        isshowlefts.value = !isshowlefts.value
        setTimeout(() => {
            isshowlefts.value = !isshowlefts.value
            getAlarmData()
        }, 500);



    }
    if (type == 2) { // 工单
        // console.log("工单", type);

        workOrderDT.value = item.id

        selectTime2.value = index
        isshowlefts2.value = !isshowlefts2.value

        setTimeout(() => {
            isshowlefts2.value = !isshowlefts2.value
            getWorkOrder()
        }, 500);

    }
    if (type == 3) { // 日常巡检

        // console.log("日常巡检", type);


        selectTime3.value = index
        inspectDT.value = item.id
        isshowlefts3.value = !isshowlefts3.value
        setTimeout(() => {
            isshowlefts3.value = !isshowlefts3.value
            getscreeninspect()
        }, 500);
    }

}

const re = (data) => {
    getAlarmData()//获取告警数据
    getWorkOrder()//获取工单数据
    getscreeninspect()//获取巡检数据
}

onMounted(() => {

    getAlarmData()//获取告警数据
    getWorkOrder()//获取工单数据
    getscreeninspect()//获取巡检数据
    emitter.on('alarmEventsUnit', re)
})
onBeforeUnmount(() => {
    emitter.off('alarmEventsUnit',re)
})
//获取告警事件数据
const getAlarmData = () => {
    getScreealarm(
        {
            searchType: 1, //查询类型(1 单位 2 -个体概览)
            alarmConfirmDT: 0,//告警类型统计 （ 0-全部  3 本月 4 年）
            alarmEventDT: alarmEventDT.value,//告警事件 （ 0-全部 1 日 2周 3 月 4 年）
            systematicId: '',//应用系统id
            days: ''          //最近几日（  7，15）
        }
    ).then(res => {

        alarmList.value[0].number = res.result.alarmEvent.alarmDealed
        alarmList.value[1].number = res.result.alarmEvent.alarmWait
        alarmList.value[2].number = res.result.alarmEvent.alarmDealing
    })
}

//获取工单处理
const getWorkOrder = () => {
    screenworkorder({
        workOrderDT: 0,//工单处理日期类型 （0-全部 1 日 2周 3 月 4 年）
        workOrderTypeDT: workOrderTypeDT.value//工单类型统计日期类型  （0-全部   3 月 5 上月）

    }).then(res => {

        workOrder.value[0].number = res.result.workOrder.workOrderDealed
        workOrder.value[1].number = res.result.workOrder.workOrderWait
    })
}
//获取日常巡检
const getscreeninspect = () => {
    screeninspect({
        inspectDT: 0,//日常巡检（0-全部  1 日 2周 3 月 4 年））


    }).then(res => {

        inspection.value[0].number = res.result.inspect.inspectTotal
        inspection.value[1].number = res.result.inspect.inspectPointDeal
        inspection.value[2].number = res.result.inspect.inspectPointWait

    })
}
</script>
<style lang="scss" scoped>
.unity-right{
  grid-template-areas: 'a'
                       'b'
                       'c'
                      ;
                     
}
</style>
